import {Component} from "react";
import './zhuce.css'
import axios from "axios";
import qs from 'qs'
class Zhuce extends Component{
    constructor(props) {
        super(props);
        this.state = {user:'',xpassword:'',password:''};
        this.queding = this.queding.bind(this);
        this.quxiao =this.quxiao.bind(this);
        this.username1 =this.username1.bind(this);
        this.xpwd =this.xpwd.bind(this);
        this.pwd =this.pwd.bind(this)
    }
    username1(e){
        this.setState({
            user:e.target.value
        })
    }
    xpwd(e){
        this.setState(
            {
                xpassword:e.target.value
            }
        )
    }
    pwd(e){
        this.setState({
            password:e.target.value
        })
    }
    queding(){
        if (this.state.user !== '' || this.state.xpassword !== '' || this.state.password !== ''){
            if (this.state.xpassword === this.state.password){
                this.props.history.push('/')
                axios.post('/api/admin/registered/do',qs.stringify({
                    adminName:this.state.user,
                    adminPwd:this.state.password
                }),{
                    headers: {
                        'Content-Type':'application/x-www-form-urlencoded'
                    }
                }).then(res=>{
                    console.log(res)
                    if (res.status===200&&res.data.msg==='注册成功'){
                        alert('注册成功')
                    }else {
                        alert('注册失败')
                    }
                })
            }else {
                alert('你输入的两次密码不统一')
            }
        }else {
            alert('用户名或密码不能为空')
        }

    }
    quxiao(){
        this.props.history.push('/')
        alert('你确定取消?')
    }
    render() {
        return (
            <div className='bj'>
             <div className='zhucekuang'>
                 <h1 className='biaoti'>欢迎新用户</h1>
                 <div className='shurukuang'>
                   <div className='user'>用户名:<input type='text' placeholder='请输入用户名' className='username1' onChange={this.username1} /></div>
                     <div className='xpwd'>新密码:<input type='password' placeholder='请输入密码' className='xpwdk' onChange={this.xpwd}/></div>
                     <div className='pwd1'>确认密码:<input type='password' placeholder='请输入密码' className='pwdk' onChange={this.pwd}/></div>
                 </div>
                     <button className='queding' onClick={this.queding}>注册</button>
                     <button className='quxiao' onClick={this.quxiao}>取消</button>
             </div>
            </div>
        )
    }
}
export {Zhuce as default}